// 实物库存管理
<template>
  <div class="inventory">
    <div class="layout-content">
      <Filtrate @changeClass="changeClass" />
    </div>
    <div class="layout-content">
      <a-tabs default-active-key="1">
        <a-tab-pane key="1" tab="库存明细表">
          <Details
            ref="details"
            :searchKey="searchKey"
            :categoryType="categoryType"
          />
        </a-tab-pane>
        <a-input-search
          slot="tabBarExtraContent"
          v-model="searchKey"
          placeholder="输入库存单号、品种、品名、规格、仓库、材料号、库位号、备注进行搜索"
          style="width: 510px;"
          @search="search"
        >
        </a-input-search>
      </a-tabs>
    </div>
  </div>
</template>

<script>
import Filtrate from "./components/filtrate";
import Details from "./components/details";

export default {
  components: {
    Filtrate,
    Details
  },
  data() {
    return {
      searchKey: undefined,
      categoryType: 0
    };
  },
  methods: {
    changeClass(val) {
      this.categoryType = val.id;
      // 确保details拿到的categoryType是最新的
      this.$nextTick(() => {
        this.$refs.details.search();
      });
    },
    search() {
      this.$refs.details.search();
    }
  }
};
</script>
